<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="icon iconfont icon-jifen"></i>招聘职位列表</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <!-- <el-button type="primary" round @click="urlAdd"><i class="el-icon-plus"> </i>&nbsp;&nbsp;发布动态</el-button> -->
            <div style="height:40px"></div>
            <div class="handle-box">
                 <el-form :inline="true"  class="demo-form-inline">
                    <el-form-item label="职位名称:">
                        <el-input v-model="title" placeholder="请输入职位名称" clearable style="width:300px;"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="onSelect"> &nbsp;&nbsp;查询&nbsp;&nbsp;  </el-button>
                        <!-- <el-button type="primary" @click="onResetting"> &nbsp;&nbsp;重置&nbsp;&nbsp;  </el-button> -->
                    </el-form-item>
                </el-form>
            </div>
            <el-table :data="tableData" border style="width: 100%" >
                <el-table-column prop="id" label="ID" width="80" align="center">
                </el-table-column>
                <el-table-column prop="post_name" label="职位名称" align="center">
                </el-table-column>
                 <el-table-column prop="city" label="招聘城市" align="center">
                </el-table-column>
                  <el-table-column prop="created_time" label="创建时间" width="170" align="center">
                </el-table-column>
                 <el-table-column prop="dead_line" label="截止时间" width="170" align="center">
                </el-table-column>
                <el-table-column type="expand" label="查看更多" width="120" align="center">
                    <template slot-scope="props">
                        <div class="bs-callout bs-callout-danger">
                            <div>
                                <span style="padding-left:30px;"></span>招聘城市：{{props.row.city}}
                                <span style="padding-left:30px;"></span>招聘数量: {{props.row.num}} 人
                                 <span style="padding-left:30px;"></span>经验要求：{{props.row.experience}}
                                <span style="padding-left:30px;"></span>学历要求: {{props.row.education}}
                                <span style="padding-left:30px;"></span>性别要求：{{props.row.sex}}
                            </div>
                            <div style="padding-left:30px;">
                               描述：{{props.row.description}}
                            </div>
                            <div>
                                <span style="padding-left:30px;"></span>薪资：{{props.row.salary_range}}
                                <span style="padding-left:30px;"></span>联系人：{{props.row.contactor}}
                                <span style="padding-left:30px;"></span>手机号码：{{props.row.mobile}}
                                <span style="padding-left:30px;"></span>固定电话：{{props.row.phone}}
                                <span style="padding-left:30px;"></span>联系地址：{{props.row.contact_address}}
                            </div>
                        </div>
                    </template>
                </el-table-column>
              
                <el-table-column label="状态" width="150" align="center">
                    <template slot-scope="scope">
                        <!-- <el-button size="small" type="text" @click="handleSel(scope.$index, scope.row)">查看</el-button> -->
                        <el-button class="del" size="small" type="text" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination" >
                    <el-pagination @current-change="handleCurrentChange" layout="prev, pager, next" :page-size="pageSize" :total="totalPages" background>
                    </el-pagination>
                </div>
        </div>
       <!-- 删除提示框 -->
        <el-dialog title="提示" :visible.sync="delVisible" width="300px" center>
            <div class="del-dialog-cnt">删除不可恢复，是否确定删除？</div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="delVisible = false">取 消</el-button>
                <el-button type="primary" @click="deleteRow">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import { mapGetters } from 'vuex'
import { getFenzhanPublicList,postFenzhanActivityDelete} from "@/api/branch/activity";
export default {
    name:"activityList",
    data () {
        return {
            pageIndex:1,//当前页码
            pageSize:10,//每页10条
            totalPages:1,//默认的总条数
            title:'',// 标题
            tableData:[],//表格数据
            delVisible:false, //是否显示查看详情弹出层
            delIndex:0,
            delId:0
        }
    },
    computed:{
        ...mapGetters(['userInfo']),
    },
    mounted() {
        // console.log(this.userInfo)
        this.$nextTick(function () {
            //获取待处理的数据
            this.getListData();  
        })
    },
    filters:{
        typeText:function(value){
        }
    },
    methods: {
        //获取tabs数据
        getListData (){
            let para ={};
            para.type = 9;//要查询的对象类型：1活动、2动态、3心情、4求购、5供应、6二手、7印厂、8设备、9招聘职位
            para.cityId = this.userInfo.city_id; //分站ID
            para.isChecked = 4;//审核状态：1所有、2审核中、3审核不通过、4审核通过
            para.title = this.title;//标题或产品名
            //具体类型：如果是查询动态，7种类型：1企业动态、2本地新闻、3协会动态、4政策动态、5本地人物、6企业访谈、7评析；
            //如果是查询心情，3种类型：1摄影园地，2随笔，3诗歌散文；
            //其他类型查询和查询全部传：0
            para.dataType = 0;
            para.pageIndex = this.pageIndex;
            para.pageSize = this.pageSize;
            //获取活动的数据
            getFenzhanPublicList(para).then(response=>{
                // console.log(response);
                if(response.code==200){
                    this.totalPages = response.data.total;//总条数
                    var data  =response.data.list;//接收返回数据
                    // console.log(data);
                    //重组数据
                    var newAry = [];
                    for(let i=0;i<data.length;i++){
                        let obj = {}
                        // debugger;
                        obj.id = data[i].id;   
                        obj.post_name = data[i].post_name;   
                        obj.num = data[i].num;   
                        obj.salary_range = data[i].salary_range;   
                        obj.city = data[i].city;   
                        obj.dead_line = data[i].dead_line;   
                        obj.description = data[i].description;   
                        obj.contactor = data[i].contactor;   
                        obj.phone = data[i].phone;   
                        obj.mobile = data[i].mobile;   
                        obj.contact_address = data[i].contact_address;   
                        obj.created_time = data[i].created_time;   
                        obj.enterprise_name = data[i].enterprise_name;  
                        //修改性别
                        if(data[i].sex == 0){
                            obj.sex = "女" ;   
                        }else if(data[i].sex == 1){
                            obj.sex = "男"  ;   
                        }else{
                            obj.sex = "不限"  ;   
                        }
                        //修改学历
                        if(data[i].education == 0){
                            obj.education = "高中" ;   
                        }else if(data[i].education == 1){
                             obj.education = "大专"  ;   
                        }else if(data[i].education == 2){
                            obj.education = "本科"  ;   
                        }else if(data[i].education == 3){
                             obj.education = "硕士"  ;   
                        }else if(data[i].education == 4){
                             obj.education = "博士"  ;   
                        }else if(data[i].education == 5){
                             obj.education = "其他"  ;   
                        }
                        else{
                             obj.education = "不限"  ;   
                        }    

                        //修改经验
                        if(data[i].experience == 1){
                            obj.experience = "1~3年"  ;   
                        }else if(data[i].experience == 2){
                            obj.experience = "3~5年"  ;   
                        }else if(data[i].experience == 3){
                            obj.experience = "5~10年"  ;   
                        }else if(data[i].experience == 4){
                           obj.experience = "10年以上"  ;   
                        }
                        else{
                            obj.experience = "不限经验"  ;   
                        } 
                      
                        newAry.push(obj);
                    }
                    
                    // console.log(newAry)
                    this.tableData = newAry;
                }else{
                    this.$notify.error({
                        title: '异常',
                        duration:2000,
                        message: '失败原因：'+response.data.msg
                    });
                }
            });
            
        },
        // 分页导航
        handleCurrentChange (val){
            this.pageIndex = val;
            this.getListData();
        },
        //查询
        onSelect(){
            this.pageIndex =1;
            this.getListData();
        },
        //查看
        handleSel(index, row) {
            if (row.id && row.id > 0) {
                //跳转到详情
                this.$router.push({ path: "/branch/mood/select" ,query:{id:row.id } });
            }
        },
        //删除
        handleDelete(index,row){
            // console.log(index,row.id);
            if(row.id && row.id>0){
                this.delIndex =index;//要删除的下标
                this.delId = row.id; //要删除的ID
                this.delVisible = true; //显示兑换弹出框
                 //console.log(this.delVisible);
            }else{
                // console.log("没触发");
            }
        },
        // 确定删除
        deleteRow(){
            //console.log(this.delId)
            if(this.delId>0){
                // console.log(this.delId)
                //对象类型： 1活动、2动态、3心情、4求购、5供应、6二手7印厂、8设备、9招聘职位
                postFenzhanActivityDelete(9,this.delId).then(response=>{
                    // console.log(response);
                    if(response.code==200){
                        this.tableData.splice(this.delIndex, 1);
                        this.$message.success('删除成功');
                        this.delVisible = false;
                    }else{
                        this.$notify.error({
                            title: '删除失败',
                            duration:2000,
                            message: '失败原因：'+response.data.msg
                        });
                    }
                    
                })
            }
            
        }
    }
}
</script>
<style lang="stylus" scoped>
    .handle-box {
        margin-bottom: 20px;
    }

    .handle-select {
        width: 120px;
    }
    .handle-input {
        width: 300px;
        display: inline-block;
        margin-right :30px;
    }
    .del-dialog-cnt{
        font-size: 16px;
        text-align: center
    }
    .edit {
    color: #ff9800;
}
.bs-callout {
    padding: 20px;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}
    .bs-callout-danger {
    border-left-color: #ce4844;
}
.del {
    color: #e51c23;
}

.download {
    color: #67C23A;
}
</style>


